<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>教师课程管理</title>

    <%@ include file="base.jsp" %>

    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" href="./css/x-admin.css" media="all">
    <link rel="stylesheet" href="css/pag.css" media="all">
    <link rel="stylesheet" href="css/query.css" media="all">
</head>

<body>
<div class="x-nav"><span class="layui-breadcrumb"> <a><cite>课程管理</cite></a> <a><cite>教授课程管理</cite></a> </span> <a
        class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right"
        href="teacher/teacherOwnController?fun=teaCourse" title="刷新"><i class="layui-icon"
                                                                        style="line-height:30px">ဂ</i></a></div>
<div class="x-body">
    <div class="tools">
        <span class="x-right" style="line-height:25px">共有课程：<span
                id="count">${allSubjectPage.total}</span> 条</span></xblock>
    </div>
    <div style="color: red;font-size: 15px">课程列表</div>
    <table class="tablelist">
        <thead>
        <tr>
            </th>
            <th>课程id</th>
            <th> 课程名称</th>
            <th> 所属学院</th>
            <th> 操作</th>
        </tr>
        </thead>
        <tbody id="x-link">
        <c:forEach var="i" items="${allSubjectPage.list}">
            <tr>
                <td>${i.suid}</td>
                <td>${i.suname}</td>
                <td>${i.cname}</td>
                <td class="td-manage">
                    <a
                            title="选课"
                            href="javascript:;"
                            onclick="orderClass(${i.suid},${allSubjectPage.pageNo})"
                            style="text-decoration:none">
                        <i class="layui-icon">&#xe642;</i>
                        选课
                    </a></td>
            </tr>
        </c:forEach>
        </tbody>
    </table>
    <div class="page" v-show="show">
        <div class="pagelist">
            <span class="jump">
                <a href="teacher/teacherOwnController?fun=teaCourse&apn=${allSubjectPage.pageNo -1}">上一页</a>
            </span>

            <c:forEach var="p" begin="1" end="${allSubjectPage.pages}">
                <a href="teacher/teacherOwnController?fun=teaCourse&apn=${p}">
                <span class="jump"
                      <c:if test="${allSubjectPage.pageNo == p}">style="background-color: skyblue" </c:if>
                >
                        ${p}
                </span>
                </a>
            </c:forEach>
            <span class="jump">
                <c:if test="${allSubjectPage.pageNo +1 > allSubjectPage.pages}">
                    <a href="teacher/teacherOwnController?fun=teaCourse&apn=${allSubjectPage.pageNo}">下一页</a>
                </c:if>
                <c:if test="${allSubjectPage.pageNo +1 <= allSubjectPage.pages}">
                    <a href="teacher/teacherOwnController?fun=teaCourse&apn=${allSubjectPage.pageNo+1}">下一页</a>
                </c:if>

            </span>
            <span class="jumppoint">跳转到：</span>
            <span class="jumpinp">
          <input type="text" id="topage">
        </span> <span class="jump gobtn" onclick="topage(${allSubjectPage.pages})">GO</span></div>
    </div>
</div>

<div class="x-body">
    <div class="tools">
        <ul class="toolbar">
            <li>
                <span onclick="deleteSelect()"><span><img src="images/t03.png"/></span>批量退课</span>
            </li>
        </ul>
        <div style="color: red;font-size: 15px">已选课程</div>
        <span class="x-right" style="line-height:25px">已选课程：<span
                id="count2">${ownSubjectPage.total}</span> 条</span></xblock>
    </div>
    <table class="tablelist">
        <thead>
        <tr>
            <th><input onclick="selectAll()" type="checkbox" name="controlAll" style="" id="controlAll">
            </th>
            <th>课程id</th>
            <th> 课程名称</th>
            <th> 所属学院</th>
            <th> 操作</th>
        </tr>
        </thead>
        <tbody id="x-link">
        <c:forEach var="i" items="${ownSubjectPage.list}">
            <tr>
                <td><input class="selected" type="checkbox" value="${i.suid}" name="selected"></td>
                <td>${i.suid}</td>
                <td>${i.suname}</td>
                <td>${i.cname}</td>
                <td class="td-manage">
                    <a
                            title="选课"
                            href="javascript:;"
                            onclick="deleteClass(${i.suid})"
                            style="text-decoration:none">
                        <i class="layui-icon">&#xe642;</i>
                        退课
                    </a></td>
            </tr>
        </c:forEach>
        </tbody>
    </table>
    <div class="page" v-show="show">
        <div class="pagelist">
            <span class="jump">
                <a href="teacher/teacherOwnController?fun=teaCourse&opn=${ownSubjectPage.pageNo -1}">上一页</a>
            </span>

            <c:forEach var="p" begin="1" end="${ownSubjectPage.pages}">
                <a href="teacher/teacherOwnController?fun=teaCourse&opn=${p}">
                <span class="jump"
                      <c:if test="${ownSubjectPage.pageNo == p}">style="background-color: skyblue" </c:if>
                >
                        ${p}
                </span>
                </a>
            </c:forEach>
            <span class="jump">
                <c:if test="${ownSubjectPage.pageNo +1 > ownSubjectPage.pages}">
                    <a href="teacher/teacherOwnController?fun=teaCourse&opn=${ownSubjectPage.pageNo}">下一页</a>
                </c:if>
                <c:if test="${ownSubjectPage.pageNo +1 <= ownSubjectPage.pages}">
                    <a href="teacher/teacherOwnController?fun=teaCourse&opn=${ownSubjectPage.pageNo+1}">下一页</a>
                </c:if>

            </span>
            <span class="jumppoint">跳转到：</span>
            <span class="jumpinp">
          <input type="text" id="topage2">
        </span> <span class="jump gobtn" onclick="topage2(${ownSubjectPage.pages})">GO</span></div>
    </div>
</div>

<br/>
<br/>
<br/>
<script src="./lib/layui/layui.js" charset="utf-8"></script>
<script src="./js/x-layui.js" charset="utf-8"></script>

<script src="js/jquery2.js" charset="utf-8"></script>
<script src="js/js.js" charset="utf-8"></script>
<script>
    layui.use(['element', 'laypage', 'layer', 'form'], function () {
        $ = layui.jquery;//jquery
        lement = layui.element();//面包导航
        laypage = layui.laypage;//分页
        layer = layui.layer;//弹出层
        form = layui.form();//弹出层
    });

</script>
<script>
    $('.tablelist tbody tr:odd').addClass('odd');
</script>
<script>

    //选课
    function orderClass(suid, apn) {
        $.ajax({
            url: '<%=request.getContextPath()%>/teacher/teacherOwnController',
            data: {
                "fun": 'order',
                "suid": suid,
                "apn": apn
            },
            success(data) {
                if (data == "0" || data == 0) {
                    layer.alert("不能重复选课！")
                } else {
                    location.href = "<%=request.getContextPath()%>/teacher/teacherOwnController?fun=teaCourse";
                }
            }
        })
    }

    //退课
    function deleteClass(suid) {
        layer.confirm(
            '您确定要取消教授该课程？(此操作可能导致选择过该课的学生强制退课！)',
            ['确定', '取消'],
            function () {
                $.ajax({
                    url: '<%=request.getContextPath()%>/teacher/teacherOwnController',
                    data: {
                        "fun": 'delete',
                        "suid": suid,
                    },
                    success() {
                        location.href = "<%=request.getContextPath()%>/teacher/teacherOwnController?fun=teaCourse";
                    }
                })
            }
        )
    }

    //批量退课
    function deleteSelect() {
        layer.confirm(
            '您确定取消教授所有选中的课程？(此操作可能导致选择过这些课的学生强制退课！)',
            ['确定', "取消"],
            function () {
                var ids = [];
                $('.selected:checked').each(function () {
                    ids.push($(this).val())
                })
                $.ajax({
                    url: '<%=request.getContextPath()%>/teacher/teacherOwnController',
                    data: {
                        "ids": ids,
                        "fun": "deleteSelect"
                    },
                    success() {
                        location.href = "<%=request.getContextPath()%>/teacher/teacherOwnController?fun=teaCourse";
                    }
                })
            }
        )
    }

    //第一个表格分页跳转
    function topage(pages) {
        let toPageNo = $('#topage').val();
        if (toPageNo > pages) {
            toPageNo = pages
        }
        $.ajax({
            url: '<%=request.getContextPath()%>/teacher/teacherOwnController',
            data: {
                "fun": 'teaCourse',
                "apn": toPageNo
            },
            success(data) {
                $('html').html(data)
            }
        })
    }

    //第二个表格分页跳转
    function topage2(pages) {
        let toPageNo = $('#topage').val();
        if (toPageNo > pages) {
            toPageNo = pages
        }
        $.ajax({
            url: '<%=request.getContextPath()%>/teacher/teacherOwnController',
            data: {
                "fun": 'teaCourse',
                "opn": toPageNo
            },
            success(data) {
                $('html').html(data)
            }
        })
    }
</script>
</body>

</html>